import React from 'react';
import { Icon,List,Picker } from 'antd-mobile';
import styles from './search.css';
import cutStr from '../../../../../framework/utils/cutStr';

const searchImg = require('../../../../../icons/search.png');
const bottomArrow = require('../../../../../icons/allPartTime/bottom-arrow.png');

const Search = ({
  selectCity,
  CityArr,
  onCitySelect=()=>{},
  onOk=()=>{},
  cityName,
}) => {

  if(!cityName){
    cityName = window.MC.cityName;
  }
  // console.log('cityName',cityName);
  return (
    <div className={styles.searchBody}>
      <div className={styles.content}>
        <div className={styles.searchInput} onClick={onOk}>
          <img src={searchImg} />
          <span>搜索你想要查找的兼职</span>
        </div>
        {cityName ? (
          <div className={styles.selectedCity} onClick={() => onCitySelect()}>
            <span id="city">{cutStr.cutString(cityName, 6)}</span>
            <Icon type='down' size='md' color='#5e5e5e' />
          </div>
        ):(
          <div className={styles.selectedCity} onClick={() => onCitySelect()}>
            <span id="city">城市</span>
            <Icon type='down' size='md' color='#5e5e5e' />
          </div>
        )}
      </div>
    </div>
  )
}

export default Search;
